$(document).ready(function() {
	SB.BillsModel = Backbone.Model.extend();

	SB.BillCollection = Backbone.Collection.extend({
		model : SB.BillsModel
	});
	SB.billCollection = new SB.BillCollection();
	
	SB.NoBillView = Backbone.View.extend({
		className : "papers",
		template : _.template($('#no-bill-tpl').html()),
		
		initialize : function() {
			_.bindAll(this, 'render');

		},

		render : function() {
			$(this.el).html(this.template());
			return this;
		}
	});

	SB.BillView = Backbone.View.extend({
		className : "papers",

		template : _.template($('#my-bill-tpl').html()),
		
		initialize : function() {
			_.bindAll(this, 'render', 'deleteBill');

		},
		
		events: {
			"click #delete-bill": "deleteBill",
			'change #remind-freq': "updateBill"
		},

		render : function() {
			$(this.el).html(this.template(this.model.toJSON()));
			if (this.model.get('paid') == true) {
				$(this.el).removeClass('unpaid');
				$(this.el).addClass('paid');
				this.$('#remind-freq').attr('disabled', true);
			}
			else {
				$(this.el).removeClass('paid');
				$(this.el).addClass("unpaid");
			}
			
			// Set selected reminder frequency
			var selector = '#remind-freq option[value="' + this.model.get('remind_freq') + '"]';
			this.$(selector).attr('selected', 'selected');
			return this;
		},
		
		deleteBill: function() {
			var r = confirm("Delete this bill? This cannot be undone!");
			if (r==false) {
				return;
			}
			var bill = {};
			bill.bill_id = this.model.get('id');
			$.post('/api/bill/delete/', bill, function(data){
				console.log(data);
				SB.createdBills = JSON.parse(data);
				SB.billCollection.reset(SB.createdBills);
			});
		},
		
		updateBill: function(){
			this.$('#remind-freq').tooltip({
				trigger : 'manual',
				title : 'Saved'
			});
			var payload = {};
			payload.remind_freq = this.$('#remind-freq').val();
			payload.bill_id = this.model.get('id');
			var $this = this;
			$.post('/api/bill/update/', payload, function(data){
				$this.model.set(JSON.parse(data));
				$this.$('#remind-freq').tooltip('show');
				setTimeout(function(){
					$this.$('#remind-freq').tooltip('hide');
				}, 1000);
			});
		}
	});

	SB.BillCollectionView = Backbone.View.extend({
		className : "span7 new-bill",
		initialize : function() {
			_.bindAll(this, 'render', 'addOne', 'removeOne');

			// Reset view when emails changes
			SB.billCollection.on('reset', this.render);
			SB.billCollection.on('add', this.addOne);
			SB.billCollection.on('remove', this.removeOne);
		},

		render : function() {
			$(this.el).html('');
			$this = this;
			_.each(SB.billCollection.models, function(model) {
				$this.addOne(model);
			});
			
			if (SB.billCollection.length == 0) {
				var noBillView = VM.reuseView("noBillView", function(){
					return new SB.NoBillView();
				});
				$(this.el).append(noBillView.render().el);
			}
			
			return this;
		},

		addOne : function(model) {
			var billView = new SB.BillView({
				model : model
			});
			$(this.el).append(billView.render().el);
			$(this.el).append('<p></p><br/>');
		},

		// Remove
		removeOne : function(model) {
		}
	});
});
